
		
		<style type="text/css">

.awesome, .awesome:visited {
	background: #222 url(http://4.bp.blogspot.com/-ZZiYrEqBOcM/UAmqhzAdSWI/AAAAAAAABC4/iz5ScL_5Pj4/s1600/alert-overlay.png) repeat-x; 
	display: inline-block; 
	padding: 5px 10px 6px; 
	color: #fff; 
	text-decoration: none;
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
        border-radius:5px;
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
	border-bottom: 1px solid rgba(0,0,0,0.25);
	position: relative;
	cursor: pointer;
font-family:Calibri, Arial, sans-serif;
}

	.awesome:hover							{ background-color: #111; color: #fff; }
	.awesome:active							{ top: 1px; }
	.small.awesome, .small.awesome:visited 			{ font-size: 18px; padding: ; }
	.awesome, .awesome:visited,
	.medium.awesome, .medium.awesome:visited 		{ font-size: 24px; font-weight: bold; line-height: 1; text-shadow: 0 -1px 1px rgba(0,0,0,0.25); }
	.large.awesome, .large.awesome:visited 			{ font-size: 30px; padding: 8px 14px 9px; }
	
	.green.awesome, .green.awesome:visited		{ background-color: #91bd09; }
	.green.awesome:hover						{ background-color: #749a02; }
	.blue.awesome, .blue.awesome:visited		{ background-color: #2daebf; }
	.blue.awesome:hover							{ background-color: #007d9a; }
	.red.awesome, .red.awesome:visited			{ background-color: #e33100; }
	.red.awesome:hover							{ background-color: #872300; }
	.magenta.awesome, .magenta.awesome:visited		{ background-color: #a9014b; }
	.magenta.awesome:hover							{ background-color: #630030; }
	.orange.awesome, .orange.awesome:visited		{ background-color: #ff5c00; }
	.orange.awesome:hover							{ background-color: #d45500; }
	.yellow.awesome, .yellow.awesome:visited		{ background-color: #ffb515; }
	.yellow.awesome:hover							{ background-color: #fc9200; }

	.pink.awesome, .pink.awesome:visited		{ background-color: #e22092; }
	.pink.awesome:hover							{ background-color: #c81e82; }



div.column-row div#content-main { width: 10%; }
.column-row, .row { margin: 0 0 18px -20px; }
	.column, .columns { float: left; display: inline; margin: 0 0 0 20px; }
</style>
	</head>
	
	<body>
						<div class="column-row">
					<div class="five columns">
						<a class="large awesome">Super Button &raquo;</a> <br /><br />
						<a class="large blue awesome">Blue Button &raquo;</a> <br /><br />
						<a class="large pink awesome">Pink Button &raquo;</a> <br /><br />
						<a class="large magenta awesome">Magenta Button &raquo;</a> <br /><br />
                                                <a class="large green awesome">Green Button &raquo;</a> <br /><br />
						<a class="large red awesome">Red Button &raquo;</a> <br /><br />
						<a class="large orange awesome">Orange Button &raquo;</a> <br /><br />
						<a class="large yellow awesome">Yellow Button &raquo;</a> 
					</div>
				
					<div class="five columns">
						<a class="medium awesome">Super Button &raquo;</a> <br /><br />
						<a class="medium blue awesome">Blue Button &raquo;</a> <br /><br />
						<a class="medium pink awesome">Pink Button &raquo;</a> <br /><br />
						<a class="medium magenta awesome">Magenta Button &raquo;</a> <br /><br />
                                                <a class="medium green awesome">Green Button &raquo;</a> <br /><br />
						<a class="medium red awesome">Red Button &raquo;</a> <br /><br />
						<a class="medium orange awesome">Orange Button &raquo;</a> <br /><br />
						<a class="medium yellow awesome">Yellow Button &raquo;</a> 
					</div>
				
					<div class="four columns">
						<a class="small awesome">Super Button &raquo;</a> <br /><br />
						<a class="small blue awesome">Blue Button &raquo;</a> <br /><br />
						<a class="small pink awesome">Pink Button &raquo;</a> <br /><br />
						<a class="small magenta awesome">Magenta Button &raquo;</a> <br /><br />
                                                <a class="small green awesome">Green Button &raquo;</a> <br /><br />
						<a class="small red awesome">Red Button &raquo;</a> <br /><br />
						<a class="small orange awesome">Orange Button &raquo;</a> <br /><br />
						<a class="small yellow awesome">Yellow Button &raquo;</a> 
					</div>
				</div>
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
				
				<div class="page-header">
					<h1>Same Buttons on Dark Background</h1>
				</div><br />

<div style="background: #333;padding: 30px 5px; float: left;">
					<div class="column-row">
						<div class="five columns">
							<a class="large awesome">Super Button &raquo;</a> <br /><br />
							<a class="large blue awesome">Blue Button &raquo;</a> <br /><br />
						        <a class="large pink awesome">Pink Button &raquo;</a> <br /><br />
							<a class="large magenta awesome">Magenta Button &raquo;</a> <br /><br />
                                                        <a class="large green awesome">Green Button &raquo;</a> <br /><br />
							<a class="large red awesome">Red Button &raquo;</a> <br /><br />
							<a class="large orange awesome">Orange Button &raquo;</a> <br /><br />
							<a class="large yellow awesome">Yellow Button &raquo;</a> 
						</div>
					
						<div class="five columns">
							<a class="medium awesome">Super Button &raquo;</a> <br /><br />
							<a class="medium blue awesome">Blue Button &raquo;</a> <br /><br />
						        <a class="medium pink awesome">Pink Button &raquo;</a> <br /><br />
							<a class="medium magenta awesome">Magenta Button &raquo;</a> <br /><br />
                                                        <a class="medium green awesome">Green Button &raquo;</a> <br /><br />
							<a class="medium red awesome">Red Button &raquo;</a> <br /><br />
							<a class="medium orange awesome">Orange Button &raquo;</a> <br /><br />
							<a class="medium yellow awesome">Yellow Button &raquo;</a> 
						</div>
					
						<div class="four columns">
							<a class="small awesome">Super Button &raquo;</a> <br /><br />
							<a class="small blue awesome">Blue Button &raquo;</a> <br /><br />
  						        <a class="small pink awesome">Pink Button &raquo;</a> <br /><br />
							<a class="small magenta awesome">Magenta Button &raquo;</a> <br /><br />
                                                        <a class="small green awesome">Green Button &raquo;</a> <br /><br />
							<a class="small red awesome">Red Button &raquo;</a> <br /><br />
							<a class="small orange awesome">Orange Button &raquo;</a> <br /><br />
							<a class="small yellow awesome">Yellow Button &raquo;</a> 
						</div>
					</div>
				</div>